<template>
  <div class="index">
    <header>
      <i></i>
    </header>
    <div class="addCheckbox">
      <ul class="selected">
  
        <li v-for="(item,index) in items" v-if="item.isChecked==false">
          <label>
            <input type="checkbox" :checked="item.isChecked" @click="checkedFunction(index,$event)">
            <span>{{item.name}}</span>
          </label>
        </li>
  
      </ul>
    </div>
  
    <!-- <vfooter></vfooter> -->
  </div>
</template>

<script>
// import vfooter from '../layouts/footer.vue'
import $ from 'jquery'
export default {
  // components: {
  //   vfooter
  // }
  data() {
    return {
      items: [],
      detailInput: false
    }
  },
  created() {
    //将重新获取的list并且获取的list不为空，把获取的list赋值给items
    if (localStorage.getItem('list') && localStorage.getItem('list') != "[]") {
      this.items = JSON.parse(localStorage.getItem('list'));
    }

  },
  methods: {
    checkedFunction(index, e) {
      // 传入的 index 为指向 将选择状态转换
      this.items[index].isChecked = this.items[index].isChecked ? false : true;
      // 将重新生成的 items 转成 json 格式的string 存入 localStorage
      localStorage.setItem("list", JSON.stringify(this.items));
      //没有读取选中的
      $(e.target).parent().parent().remove();

    }
  }
}
</script>